<template>
  <div class="tools_box">
    <!-- 弹窗页面 -->
    <el-dialog :close-on-click-modal='false' v-drag :title="$t(type_info)" v-if="dialogFormVisible" :visible.sync="dialogFormVisible" width="1250px" top="10vh" @close="close">
      <div class="physicalPageForm">
        <!-- 添加页面 -->
        <PhysicalShow ref="child_show_form" v-if="type_info === '查看'" v-bind:edit_form="form" v-bind:type_info="type_info" :addr_group_list='addr_group_list' @childForm="handleChildForm($event)"></PhysicalShow>

        <!-- 编辑页面 -->
        <PhysicalEdit ref="child_form" v-if="type_info === '编辑'" v-bind:edit_form="form" v-bind:type_info="type_info" :addr_group_list='addr_group_list' v-bind:dialogFormVisible="dialogFormVisible" @childForm="handleChildForm($event)"></PhysicalEdit>
      </div>

      <!-- 弹窗控件 -->
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="getChildData" v-if="type_info === '编辑'" class="addSubmit">{{$t('确 定')}}</el-button>
        <el-button @click="close" class="addClose">{{$t('取 消')}}</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import PhysicalEdit from './PhysicalEdit'
import PhysicalShow from './PhysicalShow'
import { addServerData, editPhysicalApi } from '@/api/network/api/physical'
export default {
  props: [
    'edit_form',
    'type_info',
    'multipleSelection',
    'addr_group_list'
  ],
  name: 'Tools',
  components: {
    PhysicalEdit,
    PhysicalShow
  },
  data () {
    return {
      form: {},
      dialogFormVisible: false,
      visible: false
    }
  },
  watch: {
    edit_form: {
      handler (val) {
        this.form = val
      },
      immediate: true
    }
  },
  methods: {
    edit_info () {
      this.dialogFormVisible = true
    },
    getChildData () {
      this.$refs.child_form.send_form()
    },
    handleChildForm (data) {
      let formData = {}
      formData = data

      // let url = ''
      if (this.type_info === '查看') {
        // url = 'physical/addServer/'
        addServerData(formData).then(response => {
          if (response.status === 0) {
            this.$messages.success(response.msg)
          }
          this.dialogFormVisible = false
          this.form = {}
          this.$emit('listData')
        })
      } else {
        // url = 'physical/editPhysicalApi/'
        editPhysicalApi(formData).then(response => {
          if (response.status === 0) {
            this.$messages.success(this.$t('配置成功'))
          }
          this.dialogFormVisible = false
          this.form = {}
          this.$emit('listData')
        }).catch(e => {
          if (e.status === -1000) {
            // this.$confirm(msg, '告警信息', {
            //   dangerouslyUseHTMLString: true,
            //   showCancelButton: false,
            //   confirmButtonText: this.$t('确定'),
            //   callback: action => {
            // this.$messages.warning(this.$t('部分配置失败'))
            this.$emit('warningDialog', e)
            this.close()
            // this.$refs.child_form.newInfoChange()
            //   }
            // })
          }
          //   this.$refs.child_form.newInfoChange()
        })
      }
    },
    close () {
      this.dialogFormVisible = false
      if (this.type_info === '编辑') {
        this.$refs.child_form.close()
      }
    }
  }
}
</script>

<style scoped>
.tools_box {
  text-align: left;
}
.physicalPageForm {
  max-height: calc(90vh - 244px);
  overflow-y: auto;
}
</style>
